<script setup lang="ts">
/**
 * @title 实时告警
 */

import {
  Close,
  ColdDrink,
  Edit,
} from '@element-plus/icons-vue'
import SearchForm from './components/SearchForm.vue'
import IgnoreWarningModal from './components/IgnoreWarningModal.vue'
import AssignWarningModal from './components/AssignWarningModal.vue'
import AuditWarningModal from './components/AuditWarningModal.vue'
import TableLists from '@/components/TableLists/TableLists.vue'
import ListsPagination from '@/components/ListsPagination/ListsPagination.vue'

import {
  calculateTheLastTime,
  useUserLists,
  useWarningList,
  useWorkOrder,
} from '@/mixins/Warning'
import { WARNING_STATES } from '@/enum'
import type { WarningInfo } from '@/types'

const searchFormRef = ref<InstanceType<
  typeof SearchForm
> | null>(null)
const ignoreWarningModalRef
  = ref<InstanceType<typeof IgnoreWarningModal>>()
const assignWarningModalRef
  = ref<InstanceType<typeof AssignWarningModal>>()
const auditWarningModalRef
  = ref<InstanceType<typeof AuditWarningModal>>()
const [warningInfo, setWarningInfo] = useShallowState<
  Partial<WarningInfo>
>({
  id: 0,
})

const { userLists, getUserLists } = useUserLists()
const { order, getOrderInfo } = useWorkOrder()
const { loading, lists, columns, pagination, getLists, handleDownload }
  = useWarningList()

async function queryLists() {
  const { state, type } = searchFormRef.value?.query || {}
  getLists((pageNumber, pageSize) => ({
    type: '1', // 查实时告警信息
    pageNumber,
    pageSize,
    state,
    warningType: type,
  }))
}

function clickSearch() {
  pagination.pageNumber = 1
  nextTick(() => {
    queryLists()
  })
}
function clickIgnoreRow(row: any) {
  setWarningInfo(row)
  ignoreWarningModalRef.value?.open()
}
function clickAssignRow(row: any) {
  setWarningInfo({
    ...row,
    warningLastTime: calculateTheLastTime(
      row.warningStartTime,
    ),
  })
  getUserLists()
  assignWarningModalRef.value?.open()
}
function clickAuditRow(row: any) {
  setWarningInfo({
    ...row,
    warningLastTime: calculateTheLastTime(
      row.warningStartTime,
    ),
  })
  getOrderInfo(row.workOrderNum)
  auditWarningModalRef.value?.open()
}

function clickDownload() {
  const { state, type } = searchFormRef.value?.query || {}
  handleDownload((pageNumber, pageSize) => ({
    type: '1', // 查实时告警信息
    pageNumber,
    pageSize,
    state,
    warningType: type,
  }))
}

onMounted(() => {
  queryLists()
})
</script>

<template>
  <div
    class="padding-sm flex-direction flex align-end container"
  >
    <TableLists
      :loading="loading"
      :lists="lists"
      :columns="columns"
      show-overflow-tooltip
      :show-toolbox="true"
      custom-download
      @download="clickDownload"
    >
      <template #actions>
        <SearchForm
          ref="searchFormRef"
          @search="clickSearch"
        />
      </template>
      <template #operate="{ row }">
        <template
          v-if="row.state === WARNING_STATES.UNSETTLED"
        >
          <TdButton
            title="处理"
            type="primary"
            :icon="Edit"
            :disabled="false"
            @click="clickAssignRow(row)"
          />
          <TdButton
            title="忽略"
            type="danger"
            :icon="Close"
            :disabled="false"
            @click="clickIgnoreRow(row)"
          />
        </template>
        <TdButton
          v-if="row.state === WARNING_STATES.PENDING"
          title="审核"
          type="success"
          :icon="ColdDrink"
          :disabled="false"
          @click="clickAuditRow(row)"
        />
      </template>
    </TableLists>
    <ListsPagination
      v-model:page-num="pagination.pageNumber"
      v-model:page-size="pagination.pageSize"
      :total="pagination.total"
      @current-change="queryLists"
      @size-change="queryLists"
    />

    <!-- 忽略告警对话框 -->
    <IgnoreWarningModal
      ref="ignoreWarningModalRef"
      :warning-id="warningInfo.id!"
      @save-success="queryLists"
    />

    <!-- 告警处理指派 -->
    <AssignWarningModal
      ref="assignWarningModalRef"
      :warning-info="(warningInfo as WarningInfo)"
      :user-lists="userLists"
      @save-success="queryLists"
    />

    <!-- 告警审核 -->
    <AuditWarningModal
      ref="auditWarningModalRef"
      :warning-info="(warningInfo as WarningInfo)"
      :work-order-info="order.warningWorkOrder"
      :work-order-users="order.warningWorkOrderUserList"
      @save-success="queryLists"
    />
  </div>
</template>
